// SCSS 变量文件 - Variables
// 用于定义项目中使用的全局变量

// 颜色系统
$primary-color: #409eff;
$primary-light: #ecf5ff;
$primary-dark: #3a8ee6;

$success-color: #67c23a;
$warning-color: #e6a23c;
$danger-color: #f56c6c;
$info-color: #909399;

// 文字颜色
$text-primary: #303133;
$text-regular: #606266;
$text-secondary: #909399;
$text-placeholder: #c0c4cc;

// 边框颜色
$border-base: #dcdfe6;
$border-light: #e4e7ed;
$border-lighter: #ebeef5;
$border-extra-light: #f2f6fc;

// 背景颜色
$bg-color: #ffffff;
$bg-color-page: #f2f3f5;
$bg-color-overlay: rgba(255, 255, 255, 0.9);

// 间距
$spacing-xs: 4px;
$spacing-sm: 8px;
$spacing-base: 16px;
$spacing-lg: 24px;
$spacing-xl: 32px;

// 圆角
$radius-small: 4px;
$radius-base: 6px;
$radius-large: 8px;
$radius-round: 50%;

// 字体大小
$font-size-xs: 12px;
$font-size-sm: 14px;
$font-size-base: 16px;
$font-size-lg: 18px;
$font-size-xl: 20px;
$font-size-xxl: 24px;

// 字体粗细
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-medium: 500;
$font-weight-bold: 600;

// 阴影
$shadow-light: 0 2px 4px rgba(0, 0, 0, 0.05);
$shadow-base: 0 2px 8px rgba(0, 0, 0, 0.1);
$shadow-dark: 0 4px 16px rgba(0, 0, 0, 0.15);

// 层级
$z-index-dropdown: 1000;
$z-index-sticky: 1020;
$z-index-fixed: 1030;
$z-index-modal-backdrop: 1040;
$z-index-modal: 1050;
$z-index-popover: 1060;
$z-index-tooltip: 1070;

// 断点
$breakpoint-xs: 480px;
$breakpoint-sm: 768px;
$breakpoint-md: 992px;
$breakpoint-lg: 1200px;
$breakpoint-xl: 1920px;

// 渐变色
$gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
$gradient-success: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
$gradient-warning: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
$gradient-danger: linear-gradient(135deg, #ff6b6b 0%, #ffa500 100%);

// 侧边栏
$sidebar-width: 240px;
$sidebar-collapsed-width: 64px;

// 头部
$header-height: 64px;

// 动画时长
$transition-fast: 0.15s;
$transition-base: 0.3s;
$transition-slow: 0.5s;